
<template>
    <!-- 活动订单详情页 -->
    <scroll-view style="background-color: #f5f5f5">
        <div class="card">
            <div
                class="row"
                style="justify-content: space-between; width: 100%"
                @click="toRefundList"
            >
                <text>有1笔售后单</text>
                <text>查看详情></text>
            </div>
        </div>
        <OrderDetailInfo></OrderDetailInfo>
        <div style="height: 10px"></div>
        <div class="card">签到后获得 50 积分</div>
        <div style="height: 10px"></div>
        <div class="card">
            <text>温馨提示:</text>
            <div>
                <text class="subText"
                    >参会用户在会议签到现场,向工作人员出示活动凭证即可!押金签到后
                    3个工作日内会自动退还。
                </text>
            </div>
        </div>
        <div>
            <div class="card">
                <div class="row" style="width: 100%">
                    <div
                        style="
                            display: flex;
                            flex-direction: column;
                            align-items: center;
                            flex-grow: 1;
                        "
                        @click="showCsDialog"
                    >
                        <uni-icons type="headphones" size="20"></uni-icons>

                        <text>联系客服</text>
                    </div>
                    <!-- <div style="flex-grow: 1"></div> -->
                    <div
                        style="
                            display: flex;
                            flex-direction: column;
                            align-items: center;
                            flex-grow: 1;
                        "
                        @click="toRefund"
                    >
                        <uni-icons type="wallet" size="20"></uni-icons>

                        <text>退订</text>
                    </div>
                </div>
            </div>
        </div>
        <uni-popup ref="csPop" type="center">
            <uni-popup-dialog
                mode="base"
                message="成功消息"
                title="提示"
                content="如遇问题,请您拨打客服电话:010-89482008?"
                :duration="2000"
                :before-close="true"
                @close="close"
                @confirm="confirm"
            ></uni-popup-dialog>
        </uni-popup>
    </scroll-view>
</template>

<script setup lang="ts">
import OrderDetailInfo from '@/activityPages/components/order-detail-info.vue'
import request from '@/utils/request'
import { defineComponent, reactive, ref, defineProps, getCurrentInstance } from 'vue'
import { onLaunch, onShow, onHide, onLoad } from '@dcloudio/uni-app'
import ReservationType from '@/activityPages/const/reservation'
import { useStore } from 'vuex'
function toRefundList() {
    uni.navigateTo({ url: '/activityPages/refund/refund-list' })
}
const csPop = ref(null)

function showCsDialog() {
    csPop.value.open()
}

function toRefund() {
    uni.navigateTo({
        url: '/activityPages/refund/refund?goodsType=活动名称&title=' + ReservationType.activity
    })
}

function close() {
    csPop.value.close()
}

function confirm() {
    csPop.value.close()

    uni.makePhoneCall({
        phoneNumber: '12312312313',
        success: () => {
            console.log('拨打电话成功！')
        },
        fail: () => {
            console.error('拨打电话失败！')
        }
    })
}
</script>

<style lang="scss" scoped>
@import url('@/activityPages/style/card.css');

.text1 {
    color: rgba(102, 102, 102, 1);
    font-size: 14px;
    text-align: left;
    font-family: PingFangSC-regular;
    font-weight: bold;
    padding-bottom: 5px;
}

.text2 {
    line-height: 14px;
    color: rgba(153, 153, 153, 1);
    font-size: 10px;
    text-align: left;
    font-family: PingFangSC-regular;
}

.row1 {
    justify-content: space-between;
    padding-bottom: 10px;
    width: 100%;
}
</style>
